<template>
  <div class="navbar" >
    <ul>
      <li>帮助</li>
      <li>搜索</li>
      <li class="select-car-btn" >选择车辆</li>
      <li @click="selfLocation">定位</li>
      <li @click="toUser" >用户</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Navbar",
  methods: {
    toUser() {
      this.$router.push({
        name: "User"
      })
    },
    selfLocation() {
      this.$store.commit("location/SELF_LOCATION");
    }
  }  
}
</script>

<style lang="scss" scoped>
.navbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 86px;
  text-align: center;
  z-index: 999;
}
li {
    display: inline-block;
    width: 44px;
    height: 44px;
    border-radius: 100px;
    background-color: $color-main;
    vertical-align: middle;
    color: #fff;
    line-height: 44px;
    text-align: center;
    font-size: 12px;
    margin: 0 17px;
    cursor: pointer;
  }

</style>